<template>
  <NavigationBar @inputClick="inputClick"></NavigationBar>
  <view class="scrollView">
    <IndexTabs></IndexTabs>
    <IndexSearch></IndexSearch>
    <IndexList></IndexList>
    <up-gap height="50rpx"></up-gap>
  </view>
</template>

<script setup>
//必须导入需要用到的页面生命周期（即使在当前页面上没有直接使用到）
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';

import { useChangeTabbar } from '@/utils/tabBar.js';
import NavigationBar from '@/components/NavigationBar/index.vue';
import IndexTabs from '@/components/IndexTabs/index.vue';
import IndexSearch from '@/components/IndexSearch/index.vue';
import IndexList from '@/components/IndexList/index.vue';
import { ref, provide } from 'vue';
import { useStore } from 'vuex';
import QQMapWX from '@/utils/qqmap-wx-jssdk.js';

useChangeTabbar();

const qqmapsdk = new QQMapWX({
  key: import.meta.env.VITE_QQMAP_SDK_KEY,
});
provide('qqmapsdk', qqmapsdk);

const store = useStore();

store.dispatch('position/getPosition', {
  reverseGeocoder: true,
  settingTitle: '请求授权当前位置',
  settingContent: '需要获取您的地理位置，可以更准确给您推荐附近的帖子！',
});

const inputClick = () => {
  uni.navigateTo({
    url: '/pages/index/search',
  });
};
</script>

<style lang="scss">
page {
  height: 100vh;
  padding-bottom: calc(96rpx + env(safe-area-inset-bottom));
}

.indexView {
  height: 100%;
  display: flex;
  flex: 1;
  flex-direction: column;
}

.scrollView {
  flex: 1;
}
</style>
